var g_MainCtrlPanel;
var g_HeadPanel;
var g_FunctionPrompt;
var g_FunctionSelect;
var g_SessionModulePanel;
var g_ContactModulePanel;
var g_DiscoverModulePanel;
var g_SettingModulePanel;

var SessionFunction = 0;
var ContactFunction = 1;
var DiscoverFunction = 2;
var SettingFunction = 3;

var g_BtnSesstion;
var g_BtnContact;
var g_BtnDiscover;
var g_BtnSetting;

var g_SessionListData;
var g_CurrChattingFriend;
var g_Chat_Panel;
var g_Chatting_Friend;
var g_UpdateChatRecord;
var g_SendDataEditBox;
init();

function Fri_Info(name,imgSrc,account)
{
	this.name = name;
	this.imgSrc = imgSrc;
	this.account = account;
	this.IPAddr ="";
	this.chatRecord = new Array();

	this.getIPAddr = function () {
		return this.IPAddr;
	};
	
	this.setIPAddr = function (IPAddr) {
		 this.IPAddr = IPAddr;
	};

	this.addNewRecord = function(newRecord){
		this.chatRecord.push(newRecord);
	};
}

function UpdateChatRecord()
{
	this.disPanel = document.getElementById("ID_Dis_Panel");
	this.loadRecord = function(chatRecord){
		this.disPanel.value = "";
		var i ;
		for ( i = 0 ; i < chatRecord.length ; i++)
		{
			this.disPanel.value += chatRecord[i] +"\n";

		}
	};

	this.addNewRecord = function(newRecord){
		this.disPanel.value += newRecord+"\n";
	}
}

function loadJsonData() {
	g_SessionListData = new Array();
	g_SessionListData[0] = new Fri_Info("吴晓霞","friend_pic_1.jpg","10001");
	g_SessionListData[1] = new Fri_Info("伍思河","friend_pic_2.jpg","10002"); 
	g_SessionListData[2] = new Fri_Info("刘慧娴","friend_pic_3.jpg","10003");
	g_SessionListData[3] = new Fri_Info("刘春宜","friend_pic_6.jpg","10004"); 
	g_SessionListData[4] = new Fri_Info("刘杰铖","friend_pic_5.jpg","10005"); 
}


function init() {
	g_MainCtrlPanel = document.getElementById("ID_Inner_Mid_Container");
	g_HeadPanel = document.getElementById("ID_Inner_Top_Container");
	g_FunctionPrompt = document.getElementById("ID_Function_prompt");

	g_BtnSesstion = document.getElementById("ID_Btn_Session");
	g_BtnContact = document.getElementById("ID_Btn_Contact");
	g_BtnDiscover = document.getElementById("ID_Btn_Discover");
	g_BtnSetting = document.getElementById("ID_Btn_Setting");
	g_Chat_Panel = document.getElementById("ID_Chat_Panel");
	g_SendDataEditBox = document.getElementById("ID_Send_Edit_Box");

	getUrlParam("account");
	loadJsonData();
	create_Session_panel();
	create_Contact_Panel();
	create_Discover_Panel();
	create_Setting_Panel();
	FunctionSwitch(SessionFunction);
	registerBtnOnClick();
	g_Chat_Panel.style.display = "none";
	g_UpdateChatRecord = new UpdateChatRecord();
	document.getElementById("ID_Dis_Panel").readOnly = true;
	g_SendDataEditBox.autofocus = true;
}

function registerBtnOnClick() {
	g_BtnSesstion.onclick = function() {
		FunctionSwitch(SessionFunction);
	}

	g_BtnContact.onclick = function() {
		FunctionSwitch(ContactFunction);
	}

	g_BtnDiscover.onclick = function() {
		FunctionSwitch(DiscoverFunction);
	}

	g_BtnSetting.onclick = function() {
		FunctionSwitch(SettingFunction);
	}

	var btnCloseChat = document.getElementById("ID_Btn_Close_Chat");
	
	btnCloseChat.onclick = function(){
		g_Chat_Panel.style.display = "none";
	}

	document.getElementById("ID_Btn_Send").onclick = function(){
		sendMesBtnOnClick();
	}

	document.onkeydown = function (e){
		if (e.key == "Enter" && g_Chat_Panel.style.display == "block")
		{
			sendMesBtnOnClick();
		}	
	}
}

function sendMesBtnOnClick() {
	if (g_SendDataEditBox.value == "") return;
	var send_text = "我:" + g_SendDataEditBox.value
	g_Chatting_Friend.addNewRecord(send_text);
	g_UpdateChatRecord.addNewRecord(send_text);
	sendData(g_SendDataEditBox.value);
	g_SendDataEditBox.value ="";
	g_SendDataEditBox.autofocus=true;
}

function FunctionSwitch(currFunctionSelect) {
	var i = 0;
	var functionPrompt;
	for (i = 0; i < g_MainCtrlPanel.children.length; i++) {
		g_MainCtrlPanel.children[i].style.display = "none";
	}
	g_MainCtrlPanel.children[currFunctionSelect].style.display = "block";
	if (SessionFunction == currFunctionSelect) {
		functionPrompt = "会话";
	} else if (ContactFunction == currFunctionSelect) {
		functionPrompt = "联系人";
	} else if (DiscoverFunction == currFunctionSelect) {
		functionPrompt = "发现";
	} else if (SettingFunction == currFunctionSelect) {
		functionPrompt = "设置";
	}
	g_FunctionPrompt.innerHTML = functionPrompt;
}

function create_Session_panel() {
	var i;
	g_SessionModulePanel = document.createElement("div");
	g_SessionModulePanel.style.className = "MainPanel";
	g_MainCtrlPanel.appendChild(g_SessionModulePanel);
	for (i = 0; i < g_SessionListData.length; i++) {
		create_Friend_List_Item(g_SessionListData[i]);
	}
}

function clearBtnColorAndBorderBottomColor(obj) {
	obj.style.color = "";
	obj.style.borderBottomColor = "";
}

function create_Contact_Panel() {
	g_ContactModulePanel = document.createElement("div");
	g_ContactModulePanel.style.className = "MainPanel";
	g_MainCtrlPanel.appendChild(g_ContactModulePanel);
	var contactType = document.createElement("div");
	g_ContactModulePanel.appendChild(contactType);

	contactType.style.height = "30px";
	contactType.style.backgroundColor = "red";
	var btn_Friend = document.createElement("button");
	btn_Friend.innerHTML = "好友";
	btn_Friend.className = "BtnContactType";
	var btn_Goup = document.createElement("button");
	btn_Goup.innerHTML = "群";
	btn_Goup.className = "BtnContactType";
	var btn_Team = document.createElement("button");
	btn_Team.className = "BtnContactType";
	btn_Team.innerHTML = "讨论组";

	contactType.appendChild(btn_Friend);
	contactType.appendChild(btn_Goup);
	contactType.appendChild(btn_Team);

	btn_Friend.onclick = function() {
		this.style.borderBottomColor = "deepskyblue";
		this.style.color = "deepskyblue";

		clearBtnColorAndBorderBottomColor(btn_Goup);
		clearBtnColorAndBorderBottomColor(btn_Team);
	}

	btn_Goup.onclick = function() {
		this.style.borderBottomColor = "deepskyblue";
		this.style.color = "deepskyblue";
		clearBtnColorAndBorderBottomColor(btn_Friend);
		clearBtnColorAndBorderBottomColor(btn_Team);
	}

	btn_Team.onclick = function() {
		this.style.borderBottomColor = "deepskyblue";
		this.style.color = "deepskyblue";
		clearBtnColorAndBorderBottomColor(btn_Goup);
		clearBtnColorAndBorderBottomColor(btn_Friend);

	}
}

function create_Discover_Panel() {
	g_DiscoverModulePanel = document.createElement("div");
	g_DiscoverModulePanel.style.className = "MainPanel";
	g_MainCtrlPanel.appendChild(g_DiscoverModulePanel);

	var btn_QQZoom = document.createElement("button");
	btn_QQZoom.className = "Btn_DiscoverPanel";
	btn_QQZoom.id = "ID_Btn_QQZoom";

	var btn_QQMail = document.createElement("button");
	btn_QQMail.className = "Btn_DiscoverPanel";
	btn_QQMail.id = "ID_Btn_QQMail";

	var btn_OfficeSite = document.createElement("button");
	btn_OfficeSite.className = "Btn_DiscoverPanel";
	btn_OfficeSite.id = "ID_Btn_OfficeSite";

	g_DiscoverModulePanel.appendChild(btn_QQZoom);
	g_DiscoverModulePanel.appendChild(btn_QQMail);
	g_DiscoverModulePanel.appendChild(btn_OfficeSite);

}

function create_Setting_Panel() {
	g_SettingModulePanel = document.createElement("div");
	g_SettingModulePanel.style.className = "MainPanel";
	g_MainCtrlPanel.appendChild(g_SettingModulePanel);
}

function create_Friend_List_Item(friend_item) {

	var ele_div = document.createElement("div");
	var ele_img = document.createElement("img");
	var ele_span = document.createElement("span");
	ele_div.className = "Friend_List_Item";
	ele_img.className = "Friend_Pic";
	ele_img.src = "./image/" + friend_item.imgSrc;
	ele_span.innerHTML = friend_item.name;
	ele_span.className = "Friend_Name";

	ele_div.appendChild(ele_img);
	ele_div.appendChild(ele_span);
	g_SessionModulePanel.appendChild(ele_div);
	ele_div.onclick = function(){
		g_Chat_Panel.style.display = "block";
		g_Chatting_Friend = friend_item;
		document.getElementById("ID_Curr_Friend_prompt").innerHTML= g_Chatting_Friend.name;
		g_UpdateChatRecord.loadRecord(g_Chatting_Friend.chatRecord);
		g_SendDataEditBox.autofocus=true;
	}
}

function sendData(msg){
	//新请求
	var request = new XMLHttpRequest();

	// 用post 向服务器发送脚本
	request.open("POST", "http://localhost:8081/");
	// 用请求主体发送纯文本消息
	request.setRequestHeader("Content-Type", "text/plain;charset=UTF-8");
	request.send(msg);

	request.onreadystatechange = function() {
		console.log("readyState:"+request.readyState )
		console.log("request.status:"+request.status);
		if (request.readyState == 4 && request.status == 200) {
			var type = request.getAllResponseHeaders("Content-Type");
			console.log(type);
			if (type.match("text")) {
				//callback(request.responseText);
				console.log("server_res:"+request.responseText);
			}
		}
	}
}

//发出一个HTTP GET 请求以获得指定URL 的内容
//当响应成功到达，验证它是否是存文本
//如果是，把它传递给指定的回调函数
function getText(url,callback){
	//创建新的请求
	var request = new XMLHttpRequest();
	//指定将获取的URL
	request.open("GET",url);
	request.onreadystatechange = function(){
		if (request.readyState === 4 && request.status === 200){
			var type = request.getAllResponseHeaders("Content-Type");
			if (type.match(/^text/)){
				callback(request.responseText);
			}
		}
	}
	request.send(null);
}

function getUrlParam ( name )
{
    var url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}
